<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>新增银行卡</title>
    <link rel="stylesheet" type="text/css" href="../../../css/api.css"/>
    <link rel="stylesheet" type="text/css" href="../../../css/common.css" />
    <link rel="stylesheet" type="text/css" href="../../../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../../../css/aui-pull-refresh.css" />
    <link rel="stylesheet" type="text/css" href="../../../css/swiper.min.css"/>
    <link rel="stylesheet" type="text/css" href="../../../css/style.css"/>
    <style>
    html,body{
        /*background: #fff;*/
    }
    .inner_header{
        font-size: 1.6rem;
        color: #000000;
        font-weight: 600;
        height: 6.9rem;
        margin: 0;
        padding: 2.4rem 0 0 0;
        box-sizing: border-box;
        background: none!important;
        box-shadow: 0rem 0rem 0.8rem 0rem rgba(0, 0, 0, 0.08);
        background: #fff!important;
    }
    .success{
        font-size: 1.4rem;
        color: #6f6f6f;
        letter-spacing: 0.03rem;
    }
    .content{
        width: 100%;
        float: left;
        margin: 6.9rem 0 0 0;
    }
    .content_title{
        width: 100%;
        height: 3.7rem;
        float: left;
        font-size: 1.3rem;
        line-height: 3.7rem;
	    letter-spacing: 0.03rem;
        color: #999999;
        box-sizing: border-box;
        padding: 0 1.3rem;
    }
    .content_box{
        width: 100%;
        box-sizing: border-box;
        padding: 0 1.65rem 0 1.35rem;
        float: left;
        background: #fff;
    }
    .content_box_list{
        width: 100%;
        height: 4.45rem;
        border-bottom: 0.1rem solid #f2f2f2;
        background: #fff;
    }
    .content_box .content_box_list:last-child(){
        border-bottom: none;
    }
    .box_list_left{
        width: 23.5%;
        height: 100%;
        line-height: 4.45rem;
        float: left;
    }
    .box_list_right{
        width: 76.5%;
        float: left;
        height: 100%;
        line-height: 4.45rem;
    }
    .list_right_ipt{
        width: 100%!important;
        height: 100%!important;
        line-height: 4.45rem!important;
        font-size: 1.5rem!important;
    }
    .content_bottom{
        width: 100%;
        height: 4rem;
        float: left;
        margin: 4.65rem auto 0 auto;
    }
    .content_btn{
        width: 93%;
        height: 4rem;
    	background-color: #ed6a20;
    	border-radius: 1.98rem;
        text-align: center;
        line-height: 4rem;
        color: #fff;
        margin: auto;
    }
    .aui-toast .aui-toast-content{
        color:#fff
    }
    </style>
</head>
<body>
    <div id="app">
        <header class="aui-bar aui-bar-nav aui-bar-light inner_header">
          <a class="aui-pull-left aui-btn" onclick="goBack()">
              <img src="../../../image/back.png">
          </a>
          <div class="aui-title">添加银行卡</div>
          <a class="aui-pull-right share_nav_right">
                <div class="success" onclick="goBack()">取消</div>
          </a>
        </header>
        <div class="content">
            <div class="content_title">请填写本人银行卡信息</div>
            <div class="content_box">
                <div class="content_box_list">
                    <div class="box_list_left">
                        姓名
                    </div>
                    <div class="box_list_right">
                        <input type="text" class="list_right_ipt" placeholder="请输入姓名" ref="user_name">
                    </div>
                </div>
                <div class="content_box_list">
                    <div class="box_list_left">
                        银行卡号
                    </div>
                    <div class="box_list_right">
                        <input type="text" class="list_right_ipt" placeholder="请输入本人银行卡号" ref="bank_card_num">
                    </div>
                </div>
            </div>
            <div class="content_bottom">
                <div class="content_btn" @click="go_url('capital_add_bankCard2','./add_bankCard2.html','')">
                    下一步
                </div>
            </div>
        </div>
    </div>
</body>
</html>
<script type="text/javascript" src="../../../script/api.js"></script>
<script type="text/javascript" src="../../../script/zepto.js"></script>
<script type="text/javascript" src="../../../script/vue.min.js"></script>
<script type="text/javascript" src="../../../script/swiper.min.js"></script>
<script type="text/javascript" src="../../../script/utils.js"></script>
<script type="text/javascript" src="../../../script/common.js"></script>
<script type="text/javascript" src="../../../script/aui-tab.js"></script>
<script type="text/javascript" src="../../../script/aui-toast.js"></script>
<script type="text/javascript" src="../../../script/aui-scroll.js"></script>
<script type="text/javascript" src="../../../script/aui-pull-refresh.js"></script>

<script type="text/javascript">

    apiready = function(){
    //setRefresh()
        var toast = new auiToast({})
        var vue = new Vue({
            el:"#app",
            data:{
            },
            methods:{
                go_url(name,url,get){
                    var data = {}
                    data["realname"] = this.$refs.user_name.value
                    data["bank_cardid"] = this.$refs.bank_card_num.value
                    data = verification(data)
                    // console.log(data);
                    if(data.code==1){
                        api.openWin({
                            name: name,
                            url: url,
                            pageParam:{
                                data:data.data
                            }
                        });
                    }else {
                        toast.fail({
                            title:data.data,
                            duration:1000
                        });
                    }

                }
            },
        })
   }

  //刷新
function setRefresh(){
    var pullRefresh = new auiPullToRefresh({
        container: document.querySelector('.aui-refresh-content'),
        triggerDistance: 100
    }, function(ret) {
        if (ret.status == "success") {
            setTimeout(function() {
                pullRefresh.cancelLoading(); //刷新成功后调用此方法隐藏
            }, 1500)
        }
    })
}
function goBack(){
    api.closeWin({});
}
function verification(data){
    for(let a in data){
        switch (a) {
            case "realname":
                let user_name = data[a]
                var regName =/^[\u4e00-\u9fa5]{2,10}$/;
                if(!regName.test(user_name)){
                    let status = {code:0,data:"真实姓名填写有误"}
                    return status
                }
            break;
            case "bank_cardid":
                let bank_card_num = data[a]
                if(bank_card_num){
                    var code = luhnCheck(bank_card_num)
                }else {
                    let status = {code:0,data:"银行卡号不能为空"}
                    return status
                }
                if(code==false){
                    let status = {code:0,data:"银行卡必须通过luhn认证"}
                    return status
                }
            break;
        }
    }
    let status = {code:1,data:data}
    return status
}
//银行卡号码检测
function luhnCheck(bankno) {
    var lastNum = bankno.substr(bankno.length - 1, 1); //取出最后一位（与luhn进行比较）
    var first15Num = bankno.substr(0, bankno.length - 1); //前15或18位
    var newArr = new Array();
    for (var i = first15Num.length - 1; i > -1; i--) { //前15或18位倒序存进数组
        newArr.push(first15Num.substr(i, 1));
    }
    var arrJiShu = new Array(); //奇数位*2的积 <9
    var arrJiShu2 = new Array(); //奇数位*2的积 >9
    var arrOuShu = new Array(); //偶数位数组
    for (var j = 0; j < newArr.length; j++) {
        if ((j + 1) % 2 == 1) { //奇数位
            if (parseInt(newArr[j]) * 2 < 9) arrJiShu.push(parseInt(newArr[j]) * 2);
            else arrJiShu2.push(parseInt(newArr[j]) * 2);
        } else //偶数位
        arrOuShu.push(newArr[j]);
    }

    var jishu_child1 = new Array(); //奇数位*2 >9 的分割之后的数组个位数
    var jishu_child2 = new Array(); //奇数位*2 >9 的分割之后的数组十位数
    for (var h = 0; h < arrJiShu2.length; h++) {
        jishu_child1.push(parseInt(arrJiShu2[h]) % 10);
        jishu_child2.push(parseInt(arrJiShu2[h]) / 10);
    }

    var sumJiShu = 0; //奇数位*2 < 9 的数组之和
    var sumOuShu = 0; //偶数位数组之和
    var sumJiShuChild1 = 0; //奇数位*2 >9 的分割之后的数组个位数之和
    var sumJiShuChild2 = 0; //奇数位*2 >9 的分割之后的数组十位数之和
    var sumTotal = 0;
    for (var m = 0; m < arrJiShu.length; m++) {
        sumJiShu = sumJiShu + parseInt(arrJiShu[m]);
    }

    for (var n = 0; n < arrOuShu.length; n++) {
        sumOuShu = sumOuShu + parseInt(arrOuShu[n]);
    }

    for (var p = 0; p < jishu_child1.length; p++) {
        sumJiShuChild1 = sumJiShuChild1 + parseInt(jishu_child1[p]);
        sumJiShuChild2 = sumJiShuChild2 + parseInt(jishu_child2[p]);
    }
    //计算总和
    sumTotal = parseInt(sumJiShu) + parseInt(sumOuShu) + parseInt(sumJiShuChild1) + parseInt(sumJiShuChild2);

    //计算luhn值
    var k = parseInt(sumTotal) % 10 == 0 ? 10 : parseInt(sumTotal) % 10;
    var luhn = 10 - k;

    if (lastNum == luhn) {
        return true;
    } else {
        return false;
    }
}
</script>
